<extend name="./public/frame.html"/>
<block name="content">
    <div class="layui-row">
        <div class="layui-inline">
            <select name="province" lay-filter="province_id" id="province_id" class="layui-input" style="width: 120px;" onchange="provinceChange();">
                <option value="">请选择省份</option>
                <volist name="province" id="vo">
                    <option value="{$vo['region_id']}">{$vo['region_name']}</option>
                </volist>
            </select>
        </div>
        <div class="layui-inline">
            <select name="city" lay-filter="city_id" id="city_id" class="layui-input" style="width: 120px;">
                <option value="">请选择城市</option>
            </select>
        </div>

        <div class="layui-inline">
            <select lay-verify="required" lay-search="" id="type" class="layui-input" style="width: 120px;">
                <option value="1">申请时间</option>
            </select>
        </div>
        <div class="layui-inline">
            <input type="text" class="layui-input date" readonly id="start" placeholder="开始时间" style="width: 120px;">
        </div>
        <div class="layui-inline">
            <input type="text" class="layui-input date" readonly id="end" placeholder="结束时间" style="width: 120px;">
        </div>

        <div class="layui-inline">
            <input type="text" lay-verify="required|title" required placeholder="请输入id"  class="layui-input" id="id" style="width: 100px;">
        </div>
        <div class="layui-inline">
            <input type="text" lay-verify="required|title" required placeholder="请输入手机号"  class="layui-input" id="phone" style="width: 120px;">
        </div>
        <div class="layui-inline">
            <input type="text" lay-verify="required|title" required placeholder="请输入处理人姓名"  class="layui-input" id="deal_name" style="width: 150px;">
        </div>
        <div class="layui-inline">
            <select lay-verify="required" lay-search="" id="progress" class="layui-input" style="width: 150px;">
                <option value="">处理进度</option>
                <volist name="progress" id="progress">
                    <option value="{$key}">{$progress}</option>
                </volist>
            </select>
        </div>
        <div class="layui-inline">
            <select lay-verify="required" lay-search="" id="deal_result" class="layui-input" style="width: 120px;margin-top: 3px;">
                <option value="">处理结果</option>
                <volist name="deal_result" id="deal_result">
                    <option value="{$key}">{$deal_result}</option>
                </volist>
            </select>
        </div>
        <div class="layui-inline">
            <button class="layui-btn" data-type="search">搜索</button>
            <button class="layui-btn layui-btn-disabled" data-type="" id="reset">复位</button>
            <!--<button class="layui-btn layui-btn-warm" data-type="excel">导出数据</button>-->
        </div>
    </div>
    <table class="layui-table" lay-filter="apply" id="apply"></table>
    <script type="text/html" id="barDemo">
        {{#if(d.progress==1){}}
        <a class="layui-btn layui-btn-xs layui-btn-warm"  lay-event="get_task">领取任务</a>
        {{#}else{}}
        <a class="layui-btn layui-btn-xs" lay-event="detail">处理详情</a>
        {{#}}}

        <a class="layui-btn layui-btn-xs" lay-event="delete">删除</a>
    </script>

    <script type="text/html" id="typeTpl">
        {{#if(d.type==1){}}
        <span style="">个人</span>
        {{#}else if(d.type==2){}}
        <span style="">公司</span>
        {{#}else{}}
        <span style="">组织</span>
        {{#}}}
    </script>
    <script type="text/html" id="resultTpl">
        {{#if(d.deal_result==1){}}
        <span style="color: lightgreen">通过</span>
        {{#}else if(d.deal_result==2){}}
        <span style="color: grey">不通过</span>
        {{#}else{}}
        <span style=""></span>
        {{#}}}
    </script>
    <script type="text/html" id="progressTpl">
        {{#if(d.progress==1){}}
        <span style="color: green">待处理</span>
        {{#}else if(d.progress==2){}}
        <span style="color: slateblue">处理中</span>
        {{#}else{}}
        <span style="color: grey">已处理</span>
        {{#}}}
    </script>

    <script type="application/javascript">
        layui.use(['table', 'laytpl', 'laydate','form'], function () {
            var table = layui.table
                , form = layui.form
                , laydate = layui.laydate;

            lay('.date').each(function(){
                laydate.render({
                    elem: this
                    ,type: 'date'
                    ,trigger: 'click'
                });
            });
            var tableIns = table.render({
                elem:"#apply",
                url:"{$url}",
                cols: [[
                    {field:'id',title:"ID", width:80,sort: true},
                    {field:'username',title:"姓名", width:80,sort: true},
                    {field:'phone',title:"手机号", width:120,sort: true},
                    {field:'backup_phone',title:"备用号码", width:100},
                    {field:'type',title:"加盟性质", width:100,templet:'#typeTpl',sort: true},
                    {field:'type_info',title:"性质信息", width:120},
                    {field:'city',title:"加盟城市", width:120},
                    {field:'car_num',title:"车辆数", width:100,sort: true},
                    {field:'car_model',title:"车辆型号", width:120},
                    {field:'driver_num',title:"司机资源", width:100,sort: true},
                    {field:'other_resource',title:"其他资源", width:150},
                    {field:'add_time',title:"申请时间", width:120,sort: true},
                    {field:'deal_name',title:"处理人员", width:100,sort: true},
                    {field:'deal_result',title:"处理结果", width:100,sort: true,templet:'#resultTpl'},
                    {field:'progress',title:"处理进度", width:100,templet:'#progressTpl',fixed:'right',sort: true},
                    {title:"操作",toolbar: '#barDemo',width:180,fixed:'right',align:'center'}
                ]],
                page:true,
                limit:10,
                done: function(res, curr, count){
                    _cur_page =curr;
                    _cur_limit =res['limit'];
                }
            });
            //监听工具条
            table.on('tool(apply)', function (obj) {
                var data = obj.data; //获得当前行数据
                var layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）
//                var tr = obj.tr; //获得当前行 tr 的DOM对象
                var id = data.id;
                if (layEvent === 'get_task') {
                    layer.confirm('确定领取任务？！', function(index){
                        $.post('/admin/franchisee/get_task',{id:id},function (res) {
                            switch (res['code']){
                                case 1:
                                    layer.msg(res['msg'],{icon: 1});
                                    break;
                                default:
                                    layer.msg(res['msg'],{icon: 5});
                                    break;
                            }
                        },'json');
                        window.location.reload();
                        layer.close(index);
                    });
                }
                else if (layEvent === 'detail') {
                    layer.open({
                        type: 2,
                        title: '编号id为'+ id +'的申请信息',
                        shadeClose: true,
                        shade: 0.8,
                        area: ['100%', '100%'],
                        content: '{:url("/admin/franchisee/apply_detail","id=")}' + id//iframe的url
                    });
                }
                else if (layEvent === 'delete') {
                    layer.confirm('确定删除', function(index){
                        $.post('/admin/franchisee/apply_del',{id:id},function (res) {
                            switch (res['code']){
                                case 1:
                                    layer.msg(res['msg'],{icon:1});
                                    break;
                                default:
                                    layer.msg(res['msg'],{icon: 5});
                                    break;
                            }
                        },'json');
                        window.location.reload();
                        layer.close(index);
                    });
                }
            });

            var $ = layui.jquery, active = {
                search: function () {
                    var province_id = $('#province_id').val(),
                        city_id = $('#city_id').val(),
                        start = $('#start').val(),
                        end = $('#end').val(),
                        id = $('#id').val(),
                        phone = $.trim($('#phone').val()),
                        deal_name = $.trim($('#deal_name').val()),
                        progress = $('#progress').val(),
                        deal_result = $('#deal_result').val(),
                        reset = $('#reset');
                    if(province_id||city_id||start||end||id||phone||deal_name||progress||deal_result){
                        reset.removeClass('layui-btn-disabled').addClass('layui-btn-normal').data('type', 'reset');
                        tableIns.reload({
                            url: '/admin/franchisee/apply_search',
                            where: {
                                province_id : province_id,
                                city_id : city_id,
                                start : start,
                                end : end,
                                id : id,
                                phone : phone,
                                deal_name : deal_name,
                                progress : progress,
                                deal_result : deal_result
                            } //设定异步数据接口的额外参数
                        });
                    }else{
                        reset.removeClass('layui-btn-normal').addClass('layui-btn-disabled').data('type', '');
                        layer.alert('搜索项不能为空');
                    }
                }
                , reset: function () {
                    var reset = $('#reset');
                    if (reset.data('type') !== '') {
                        tableIns.reload({
                            url: '/admin/franchisee/apply_table', where:{}
                        });
                    }
                    $('.layui-input').each(function () {                        $(this).val('');                    });                $('.layui-this').each(function () {$(this).removeClass('layui-this');});
                    reset.removeClass('layui-btn-normal').addClass('layui-btn-disabled').data('type', '');
                }
//                , excel: function () {
//                    var province_id = $('#province_id').val(),
//                        city_id = $('#city_id').val(),
//                        type = $('#type').val(),
//                        start = $('#start').val(),
//                        end = $('#end').val(),
//                        start_arean = $("#start_arean").val(),
//                        end_arean = $("#end_arean").val(),
//                        order_sn = $.trim($('#order_sn').val()),
//                        type_phone = $('#type_phone').val(),
//                        phone = $.trim($('#phone').val()),
//                        order_status = $('#order_status').val(),
//                        car_plate = $.trim($('#car_plate').val()),
//                        pay_type = $('#pay_type').val(),
//                        is_pay = $('#is_pay').val();
//                    var str = "&phone="+ phone + "&type=" + type + "&start="
//                        + start + "&end=" + end + "&order_status=" + order_status+ "&pay_type=" + pay_type
//                        + "&car_plate=" + car_plate + "&start_arean=" + start_arean + "&end_arean=" + end_arean + "&province_id=" + province_id + "&city_id=" + city_id + "&order_sn=" + order_sn+ "&type_phone=" + type_phone + "&is_pay=" + is_pay;
//                    layer.confirm('请选择导出内容:', {
//                        btn: ['全部数据', '当前页', '取消'] //可以无限个按钮
//                        , btn3: function (index, layero) {
//                            layer.close(index);
//                        }
//                    }, function (index, layero) {
//                        //按钮【按钮一】的回调
//                        location = "{:url('excel','all=1')}"+str ;
//                        layer.close(index);
//                    }, function (index) {
//                        location = "{:url('excel','all=2')}" + str+"&page="+_cur_page+"&limit="+_cur_limit;
//                        layer.close(index);
//                    });
//                }
            };
            $('.layui-btn').on('click', function () {
                var type = $(this).data('type');
                active[type] ? active[type].call(this) : '';
            });
        });

        function provinceChange() {
            var province_id = $("#province_id").val();
            if(province_id == 0) {
                if(province_id == 0){
                    $("#city_id").empty();
                    $("#city_id").append('<option value=>请选择城市</option>');
                    return false;
                }
            }

            $.ajax({
                type: 'POST',
                url: "{:url('admin/interOrder/getCityList')}",
                data: {'province_id':province_id},
//                dataType:  'json',
                success:function(res){
                    $("select[name='city']").empty();
                    $("#city_id").append("<option value=''>全部城市</option>" + res);
                },
                error:function (res) {
                    layer.msg('请求错误');return false;
                }
            });
        }

    </script>
</block>
